<div class="layui-card">

    <div class="layui-card-body">
        <h1 style="margin-left: 400px">年报</h1>
        <div class="layui-form toolbar">
            <div class="layui-inline layui-show-xs-block">
                <input class="layui-input" autocomplete="off" placeholder="选择年份" name="start" id="start" ></div>
            <button id="menus-btn-search" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
        </div>

        <!-- 数据表格 -->
        <table class="layui-table" id="annual-table" lay-filter="menus-table"></table>
    </div>
</div>


<script>

    layui.use(['form', 'table', 'util', 'config', 'admin', 'formSelects', 'treetable','laydate'],function () {
        var table = layui.table;
        var layer = layui.layer;
        var admin = layui.admin;
        var treetable = layui.treetable;
        var laydate = layui.laydate;
        var config = layui.config;
        var laydate=layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#start', //指定元素
            type: 'year',
            format: 'yyyy', //日期格式
            min: '2020-01-01 00:00:00', //最小日期
            change : function(value, date) {
                $("#start").val(value);
            },
            ready : function(date) {
                $(".layui-laydate").off('click').on('click', '.layui-laydate-list li', function() {
                    $(".layui-laydate").remove();
                });
            }
        });

        $.ajax({
            url: config.base_server + 'api-administrators/finance/annualReport',
            data: {access_token: config.getToken().access_token},
            type:'get',
            dataType:'json',
            success:function (aa) {
                console.log(aa.data[0].datetime);
                var ul='';
                for (var i = 0; i <aa.data.length ; i++) {
                    ul+="<li style='display: block;float: left;margin-left: 50px;'>"+aa.data[i].datetime+"</li>";
                }
                $("#ul").html(ul);
                form.render();
            }
        });
        // 渲染表格
        var renderTable = function () {
            table.render({
                elem: '#annual-table',
                url: config.base_server + 'api-administrators/finance/annualFindAll',
                where: {
                    access_token: config.getToken().access_token
                },
                page: true,
                parseData: function (res) {
                    console.log(res)
                    return{
                        "code":0,
                        "msg":"",
                        "total":res.data.total,
                        "data":res.data.list,
                        "count":res.data.total,
                    };
                },
                totalRow: true,
                cols: [[
                    {type: 'numbers',totalRowText: '合计'},
                    {field: 'orcode', minWidth: 200, title: '订单号'},
                    {field: 'stname', title: '工位名称'},
                    {field: 'letime',  align: 'center', title: '租赁时间'},
                    {field: 'prices',  align: 'center', title: '订单价格',sort: true, totalRow: true},
                    {field: 'crtime', title: '创建时间'}
                ]]
            });
        };

        renderTable();

        // 搜索按钮点击事件
        $('#menus-btn-search').click(function () {
            var keyword = $('#start').val();
            table.reload('annual-table', {where: {crtime: keyword+'-1-1'}});
        });
    });
</script>